// 为某个id选择器绑定一个事件
function BindBtnEvent(btn_id, func) {
    $(btn_id).click(func)
}

// 声明三个按钮变量
let next_btn = $('#next-step');
let pre_btn = $('#pre-step');
let go_btn = $('#go-index');
let button_groups = $('.button-groups');
let button_groups_next_step = $('.button-groups-next-step')

// 下一步按钮事件
function Next_Step() {
    button_groups.stop().fadeOut(300);
    button_groups_next_step.stop().fadeIn(600);
    $(".input-div").each(function () {
        $(this).children('input:not(#id_headImg)').attr('readonly', true);
    });

}

// 到主页事件
function Go_index() {
    window.location.replace('/index/');
}

// 上一步按钮事件
function Pre_Step() {
    button_groups.stop().fadeIn(300);
    button_groups_next_step.stop().fadeOut(600);
    $(".input-div").each(function () {
        $(this).children('input:not(#id_headImg)').attr('readonly', false);
    });
}

// ajax提交请求
function Submit_Ajax() {
    // 重置错误信息
    $(".error-msg").text("");
    $("#id_headImg").next().text("");
    // 表单组件
    const formData = new FormData($("#addinfo")[0]);
    // ajax提交
    $.ajax({
        url: '/addinfo/ajax/',  // 注册页面的访问URL
        type: 'post',
        data: formData,
        dataType: "JSON",
        cache: false,                      // 不缓存
        processData: false,                // jQuery不要去处理发送的数据
        contentType: false,
        success: function (res) {  // 注册成功后的回调函数
            if (res.status) {
                // $('.input-div').children('img').attr('src', '/static' + res.user_img_url)
                let num = Math.random() * 5
                $('.input-div').children('img').attr('src', `/static${res.user_img_url}?${num}`);
                Next_Step();
            } else {
                $.each(res.errors, function (name, data) {
                    $("#id_" + name).next().text(data[0]);
                })
            }
        }
    })
}

// 为input框添加样式
function AddClass_2_input() {
    $(".input-div").each(function () {
        $(this).children('input:not(#id_headImg)').addClass('my-input');
    });
    $('#id_position').addClass('my-input');
}

// 主函数入口
$(function () {
    BindBtnEvent('#next-step', Submit_Ajax);
    BindBtnEvent('#pre-step', Pre_Step);
    BindBtnEvent("#go-index", Go_index);
    $("#id_headImg").removeClass("form-control my-input");
    AddClass_2_input();
});